import {PureComponent} from "react"
import {InputItem,Button} from "antd-mobile"
import MToast from "../../components/Util/MToast"
import { createForm } from 'rc-form';
import {connect} from "dva"
import {isNull} from "../../utils/helper"
import {setLogout} from "../../utils/request"
import "./Login.less";
import md5 from "md5"
@connect(()=>{
	return {}
})

@createForm()
export default class ChangePassword extends PureComponent{
	constructor(props){
		super(props);
		this.state={
		}
	}
	componentWillMount(){
		document.title="修改密码";
		let { dispatch, location } = this.props;
    dispatch({
      type: "global/setHeaderTitle",
      payload: {
        title: "修改密码",
        path: location.pathname + location.search
      }
    });
	}
	changePassword=()=>{
		let {dispatch,history}=this.props;
		const {validateFields,setFieldsValue} = this.props.form;
		let that = this;
		validateFields((err,value)=>{
			let {username,oldPass,newPass,comPass}=value;
			if(isNull(username)){
				MToast.fail("请输入用户名",2,null,false)
			}
			else if(isNull(oldPass)){
				MToast.fail("请输入旧密码",2,null,false)
			}
			else if(isNull(newPass)){
				MToast.fail("请输入新密码",2,null,false)
			}
			else if(isNull(comPass)){
				MToast.fail("请确认密码",2,null,false)
			}
			else if(comPass!==newPass){
				MToast.fail("两次输入密码不一致",2,null,false)
			}
			else if(oldPass===newPass){
				MToast.fail("新密码不能和旧密码相同",2,null,false)
			}
			else{
				that.setState({
					loading:true
				})
				let obj={
					username:username,
					old_pwd:md5(oldPass),
					new_pwd:md5(newPass)
				}
				dispatch({
					type:"login/changePwd",
					payload:{
						...obj,
						callback:(result)=>{
							that.setState({
								loading:false
							})
							let {code,msg}=result;
							if(code!=10200){
								MToast.fail(msg,2,null,false)
							}
							else{
								MToast.success("修改成功，正在跳转登录页",2,null,false)
								setTimeout(()=>{
									setLogout();
								},1000)
							}
						}
					}
				})
			}
		})
	}
	render(){
		let logo =localStorage[MI_APP_CODE+"logo"];
		let website =localStorage[MI_APP_CODE+"website"];
		let {getFieldProps}=this.props.form;
		let {loading}=this.state;
		return (
			<div className="login-box" style={{paddingTop:"50px"}}>
				<div className="logo">
					<img src={"./"+logo} alt="" /><br/>
					<span style={{fontSize:"2.5rem"}}>
						{/* {website} */}
						修改密码
					</span>
				</div>
				<div className="content">
					<InputItem
						{
							...getFieldProps('username',{
								rules:[
									{required:true}
								],
								initialValue:localStorage[MI_APP_CODE+"username"],
							})
						}
						editable={false}
						placeholder="请输入用户名"
						clear
					/>
					<InputItem
						{
							...getFieldProps('oldPass',{
								rules:[
									{required:true}
								]
							})
						}
						placeholder="请输入旧密码"
						clear
						type="password"
					/>
					<InputItem
						{
							...getFieldProps('newPass',{
								rules:[
									{required:true}
								]
							})
						}
						placeholder="请输入新密码"
						clear
						type="password"
					/>
					<InputItem
						{
							...getFieldProps('comPass',{
								rules:[
									{required:true}
								]
							})
						}
						placeholder="请确认密码"
						clear
						type="password"
					/>
					<Button
						loading={loading}
						disabled={loading}
						type="primary"
						onClick={()=>this.changePassword()}>修改密码</Button>
				</div>
			</div>
		)
	}
}